<style>
    .student-identity{
        margin: 3px 3px 3px 3px;
        padding: 2px 2px 2px 2px ;
    }
    .identity-img-body{
        text-align: center;
        height: 300px;

    }
    .identity-img{
        background-repeat: repeat;
        width: 390px;
        height: 260px;
        padding-right: 10px;
        line-height: 260px;
    }
    .img-body{
        text-align: center;
        font-size: 200%;
    }
    .font-iden{
        color: red;
        text-align: center;
        width: 390px;
        height: 40px;
        margin: 0 auto;
    }
    .font-iden-i{
        color: red;
        text-align: center;
        height: 40px;
        display: inline;
        width: 180px;
    }
    .btn-exam{
        text-align: center;
    }

</style>
<div class="layui-fluid">
    <form class="layui-form student-identity" action="" lay-filter="student-confirmIdentity-form">
        <div class="layui-row">
            <!--身份证正面照片及身份证号-->
            <div class="layui-col-xs5 layui-col-md-offset1">
                <div class="layui-col-xs12">
                    <div class="layui-card">
                        <div class="layui-card-body img-body">
                            <div class="identity-img-body">
                                <img id="img-identity-idenFrontImg" data-th-src="${idenFront}" alt="身份证正面"
                                     class="identity-img">
                                <input name="idenFront" data-th-value="${idenFront}" type="hidden">
                                <input id="identity-stuid" name="id" data-th-value="${student.id}" type="hidden">
                                <input name="remark" id="identity-disagree" type="hidden">
                            </div>
                            <div class="font-iden" id="identityConfirm-identityNum">
                                <input class="font-iden layui-input" id="identity-identityFront" name="identityFrontN"
                                       lay-verify="identity" minlength="18" maxlength="18">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--身份证反面照片及有效日期-->
            <div class="layui-col-xs5">
                <div class="layui-col-xs12">
                    <div class="layui-card">
                        <div class="layui-card-body img-body">
                            <div class="identity-img-body">
                                <img id="img-identity-idenBackImg" data-th-src="${idenBack}" alt="身份证反面"
                                     class="identity-img">
                                <input name="idenBack" data-th-value="${idenBack}" type="hidden">
                            </div>
                            <div id="identityConfirm-identityDate">
                                <input class="font-iden-i layui-input" id="identity-identityContraryBegin"
                                       name="identityContrarynBegin"
                                       autocomplete="off" lay-verify="date">
                                ~
                                <input class="font-iden-i layui-input" id="identity-identityContraryEnd"
                                       name="identityContrarynEnd"
                                       autocomplete="off" lay-verify="date">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--驳回、审批通过、已审核按钮-->
            <div class="layui-col-xs12">
                <div class="layui-card">
                    <div class="layui-card-body btn-exam">
                        <button class="layui-btn layui-btn-danger" type="button" lay-submit=""
                                id="btn-identity-submitDisagree">驳回</button>
                        <button class="layui-btn" lay-submit="" type="button" lay-filter="student-agree-form-submit"
                                id="btn-identity-submitAgree">审批通过</button>
                        <button class="layui-btn" type="button" id="btn-identity-finish">已审核</button>
                    </div>
                </div>
            </div>
            <div class="layui-form-item febs-hide">
                <button class="layui-btn" lay-submit="" lay-filter="student-disagree-form-submit"
                        id="btn-identity-submit"></button>
            </div>
        </div>
    </form>
</div>

<script data-th-inline="javascript">
    layui.use(['febs', 'form', 'validate'], function () {
        let $ = layui.$,
            febs = layui.febs,
            layer = layui.layer,
            form = layui.form,
            indetity = [[${indetity}]],
            student = [[${student}]],
            idenFront = [[${idenFront}]],
            idenBack = [[${idenBack}]],
            validate = layui.validate;

        form.verify(validate);
        form.render();

        initCollegeValue();
        initbtn();

        //input数据填充
        function initCollegeValue() {
            if (indetity != null){
                form.val("student-confirmIdentity-form", {
                    "identityFrontN": indetity.IDENTITY,
                    "identityContrarynBegin": indetity.IDEN_BEGIN_DATE,
                    "identityContrarynEnd" : indetity.IDEC_END_DATE
                });
            }
        }

        //表单提交
        function initbtn(){
            //审批通过提交
            form.on('submit(student-agree-form-submit)', function (data) {
                febs.post(ctx + 'student/affirm/agreeIdentity?typeId=1',data.field,function () {
                    febs.alert.success(student.stuName + '的身份证审核已通过');
                });
                $("#btn-identity-submitAgree").attr("style", "display:none;");
                $("#btn-identity-submitDisagree").attr("style", "display:none;");
                $("#btn-identity-finish").show();
                $("#btn-identity-submitAgree").attr("disabled",true);
                return false;
            });
            //驳回时弹框填写驳回原因
            $("#btn-identity-submitDisagree").click(function () {
                layer.open({
                    type: 1
                    ,title: '驳回原因' //不显示标题栏
                    ,closeBtn: false
                    ,area: '300px;'
                    ,shade: 0.8
                    ,id: 'LAY_layuipro' //设定一个id，防止重复弹出
                    ,btn: ['提交', '取消']
                    ,btnAlign: 'c'
                    ,moveType: 1 //拖拽模式，0或者1
                    ,content: '<div style="padding:5px;line-height: 22px; color: #fff; font-weight: 300;' +
                        'text-align: center"><textarea id="txt-identity-disAgreeInfo" name="remark" maxlength="200" ' +
                        'class="layui-textarea" placeholder="请填写驳回原因"></textarea></div>'
                    ,success: function(layero){
                        var btn = layero.find('.layui-layer-btn');
                        btn.find('.layui-layer-btn0').click(function(){
                            $("#identity-disagree").val($("#txt-identity-disAgreeInfo").val());
                            if ($("#identity-disagree").val()==null||$("#identity-disagree").val()=="") {
                                febs.alert.warn('未填写驳回原因！');
                                return false;
                            }else {
                                $("#btn-identity-submit").click();
                                $("#showinfo",parent.document).load("febs/views/student/affirm/identity?id="+
                                    $("#identity-stuid").val()+"&typeId=1")
                                return false;
                            }

                        })
                    }
                });
            })
            //驳回提交事件
            form.on('submit(student-disagree-form-submit)', function (data) {
                febs.post(ctx + 'student/affirm/rejectIden?typeId=1',data.field,function () {
                    febs.alert.success(student.stuName + '的身份证审核已驳回');
                });
                $("#btn-identity-submit").attr("disabled",true);
                return false;
            });

            if(student.idFrontImgUrl==null&&student.idBackImgUrl==null&&idenBack!=null&&idenFront!=null){
                $("#btn-identity-finish").attr("style", "display:none;");
            }else if(student.idFrontImgUrl!=null&&student.idBackImgUrl!=null&&idenBack==null&&idenFront==null){
                $("#img-identity-idenFrontImg").attr("src",student.idFrontImgUrl);
                $("#img-identity-idenBackImg").attr("src",student.idBackImgUrl);
                $("#btn-identity-submitAgree").attr("style", "display:none;");
                $("#btn-identity-submitDisagree").attr("style", "display:none;");
                $("#identity-identityFront").attr("readonly",true);
                $("#identity-identityContraryBegin").attr("readonly",true);
                $("#identity-identityContraryEnd").attr("readonly",true);
                $("#identity-identityFront").val(student.identity);
                $("#identity-identityContraryBegin").val(student.idenBeginDate.substring(0,10));
                $("#identity-identityContraryEnd").val(student.idecEndDate.substring(0,10));
            }else if(student.idFrontImgUrl!=null&&student.idBackImgUrl!=null&&idenBack!=null&&idenFront!=null){
                $("#btn-identity-finish").attr("style", "display:none;");
            }else if(student.idFrontImgUrl==null&&student.idBackImgUrl==null&&idenBack==null&&idenFront==null){
                $("#img-identity-idenFrontImg").replaceWith("<input type='text' style='border: none;" +
                    "text-align: center;margin-top: 150px;' value='未上传'>");
                $("#img-identity-idenBackImg").replaceWith("<input type='text' style='border: none;" +
                    "text-align: center;margin-top: 150px;' value='未上传'>");
                $("#btn-identity-finish").attr("style", "display:none;");
                $("#btn-identity-submitAgree").attr("style", "display:none;");
                $("#btn-identity-submitDisagree").attr("style", "display:none;");
                $("#identityConfirm-identityDate").attr("style","display:none");
                $("#identityConfirm-identityNum").attr("style","display:none");
            }
        }
    });
</script>